<template>
    <div>
        <indextop></indextop>
        <router-view></router-view>
        <bottom_bottom></bottom_bottom>


    </div>
</template>

<script>

    import indextop from "./indextop";
    import bottom from "./bottom";
    import bottom_bottom from "./bottom_bottom";

    export default {
        name: "index",
        components: {
            indextop,
            bottom,
            bottom_bottom
        }

    }
</script>

<style lang="less" scoped>




</style>


<!--
<template>
    <div>
        <div class="yy">
            6666
        </div>
        <div>
            <div class="box">
                <div class="iteam">1</div>
                <div class="iteam">2</div>
                <div class="iteam">3</div>
                <div class="iteam">4</div>
                <div class="item">5</div>
                <div class="iteam">6</div>
                <div class="iteam">7</div>
                <div class="iteam">8</div>
                <div class="iteam">9</div>
                <div class="iteam">10</div>
                <div class="iteam">11</div>
            </div>
        </div>

        <hr/>

        <div class="k">
            <div class="left"></div>
            <div class="right"></div>
        </div>

        <hr/>
        <br>
        <br>
        <br>
        <br>

        <div id="father">
            <div id="first">第一个盒子</div>
            <div id="second">第二个盒子</div>
            <div id="third">第三个盒子</div>
        </div>


        <hr/>
        <br>
        <br>
        <br>
        <br>
        <div class="bg">

        </div>
        <br/>
        <br/>
        <br/>
        <br/>
        <br/>


    </div>
</template>

<script>
    export default {
        name: "elhead",

    }
</script>

<style scoped>
    .yy {
        margin: 0 auto;
        width: 600px;
        height: 30px;
        border-radius: 31px;
        border-width: 12px 15px 16px 12px;
        background-size: cover;
        background-repeat: no-repeat;
        overflow: auto;
        resize: both;
        background-image: url("../assets/images/bg.jpg");
        -moz-border-image: url('../assets/images/r4.png') 12 15 16 12;
        -webkit-border-image: url('../assets/images/r4.png') 12 15 16 12;
        -o-border-image: url('../assets/images/r4.png') 12 15 16 12;
        border-image: url('../assets/images/r4.png') 12 15 16 12;
        box-shadow: 0 0 15px #000000;;
    }
    .box {
        width: 500px;
        height: 300px;
        border: #00ffff solid 5px;
        display: flex;
        /*flex-flow: wrap;*/
        flex-wrap: wrap;
        justify-content: center;
    }
    .iteam {
        width: 50px;
        height: 50px;
        border: #1a66b3 solid 2px;
    }

    .k{
        width: 600px;
        border: #ff0000 solid 1px;
    }
    .k:after{
        content: '';
        display: block;
        clear: both;
    }
    .left{
        width: 100px;
        height: 100px;
        border: #1a66b3 solid 1px;
        float: left;
    }
    .right{
        width: 100px;
        height: 100px;
        border: #1a66b3 solid 1px;
        float: right;
    }


    #father {
        width: 300px;
        border:1px #666 solid;
        padding:0;
        position: relative;
    }
    #first {
        background-color:#f2bb6f;
        border:1px #B55A00 dashed;


    }
    #second {
        background-color:#003580;
        border:1px #0000A8 dashed;
        position: relative;
        bottom: 20px;


    }
    #third {
        background-color:#f3f3f3;
        border:1px #395E4F dashed;
        position: absolute;
        right: 30px;

    }

    .bg{
        width: 500px;
        height: 500px;
        margin: 0 auto;
        border: #1a66b3 solid 1px;
        background-image: url("../assets/images/bg/2.jpg");
        background-size:100% 100%;
        background-repeat: no-repeat;

    }

</style>
-->

